<template>
    <div>
        <h4>- export命令显式指定输出的代码，再通过import命令输入 属于 编译时加载”或者静态加载</h4>
        <h4>- ES6 的模块自动采用严格模式 特别注意this的限制，ES6 模块之中，顶层的this指向undefined，即不应该在顶层代码使用this</h4>
        <h4>- export 命令 用于规定模块的对外接口</h4>
        <code>写法：export var firstName = 'Michael'; 或者：export {firstName}; 还可以<b>重命名</b>：function v1() { ... }; export { v1 as name}</code>
        <p>注意！：export 不能输出一个值 应该输出一个接口（代码）例如：<code>var m = 1;export m;//报错 正确写法：var m = 1;export {m}; 或者：var m = 1;export default m;</code></p>
        <p>export语句输出的接口，与其对应的值是动态绑定关系，即通过该接口，可以取到模块内部<b>实时的值</b></p>
        <p>export 必须处于模块顶层 不能在 块级作用域里</p>
        <h4>- import 命令 用于输入（加载）其他模块提供的功能</h4>
        <p>如果import 的 a是一个对象，改写a的属性是允许的 但是这种写法很难差错！！所以最好只读</p>
        <p>import命令具有提升效果，会提升到整个模块的头部，首先执行</p>
        <p>由于import是静态执行，所以不能使用表达式和变量，这些只有在运行时才能得到结果的语法结构</p>
        <p>import语句会执行所加载的模块 所以可以这样：<code>import 'lodash';</code>多次加载只执行一次</p>
        <h4>- 模块的整体加载 用星号（*）指定一个对象，所有输出值都加载在这个对象上面 <code>import * as circle from './circle';</code></h4>
        <h4>- export default 命令 import时可以使用任意名字 不能使用大括号</h4>
        <h4>- export 与 import 的复合写法</h4>
        <p>export { foo, bar } from 'my_module';//先导入后输出，实际上并没有被导入当前模块，只是相当于对外转发了这两个接口，导致当前模块不能直接使用foo和bar</p>
        <h4>- 模块的继承</h4>
        <p>export * from 'circle';//输出circle模块的所有属性和方法，export *命令会忽略circle模块的default方法，相当于是当前模块继承了circle模块</p>
        <h4>- import()</h4>
        <p>require()是运行时动态加载的 而 import 是编译时静态分析的 因此加入import()被用来动态加载</p>
        <p>import()会返回一个 Promise对象 then中接受导入模块的对象；同时加载多个用Promise.all()；import()也可以用在 async 函数之中</p>
    </div>
</template>

<script>
export default {
    
}
</script>

<style scoped>

</style>